<template>
	<view class="user-order">
		<tabs :active="active" @change="changeShow" :config="{itemWidth: 180}">
			<tab v-for="(item, index) in order" :key="index" :title="item.name" :name="item.type">
				<!-- <order-list v-if="item.isShow" :order-type="item.type" :ref="'order' + item.type"></order-list> -->
				<view class="all">
					<view class="list"
						@click="toxq(items.title,items.price,items.order_sn,items.order_status,items.is_auto)"
						v-for="(items,indexs) in list" :key="indexs">
						<view class="list_top">
							<image :src="items.img" mode=""></image>
							<view class="list_right">
								<view class="ltop">
									<p style="color: #000000;font-size: 30rpx;">{{items.title}}</p>
									<p style="color: #20bf50;ffont-size: 30rpx;">{{item.name}}</p>
								</view>
								<view class="lbot">
									<p style="color: #ED1C24;font-size: 35rpx; font-weight: bold;">+{{items.price}}</p>
									<p style="color: #CCCCCC;font-size: 30rpx;">订单编号:{{items.order_sn}}</p>
								</view>
							</view>
						</view>
						<view class="time" v-show="items.time?true:false">
							<p style="color: #CCCCCC;font-size: 35rpx;margin-top: 20rpx;">
								<text style="color: #F43F3B;">剩余时间</text>
								<u-count-down :timestamp="items.time" color="#F43F3b">
								</u-count-down>
							</p>
						</view>
					</view>
				</view>
			</tab>
		</tabs>
		<!-- <float-tab></float-tab> -->
	</view>
</template>

<script>
	import {
		taskType
	} from '@/utils/type';
	import {
		waitSubmit
	} from '@/api/user';
	import {
		auditLists
	} from '@/api/user';
	import {
		through
	} from '@/api/user';
	import {
		unthrough
	} from '@/api/user';
	import {
		timeToDate
	} from '@/utils/wechath5.js';
	export default {
		data() {
			return {
				active: taskType.SUB,
				order: [{
						name: '待提交',
						type: taskType.SUB,
						isShow: false
					},
					// {
					//      name: '待付款',
					//      type: orderType.PAY,
					//      isShow: false
					//    }, 
					{
						name: '审核中',
						type: taskType.EXAMINE,
						isShow: false
					},
					{
						name: '已通过',
						type: taskType.ADOPT,
						isShow: false
					}, {
						name: '未通过',
						type: taskType.FAIL,
						isShow: false
					},
					// {
					//      name: '已关闭',
					//      type: orderType.CLOSE,
					//      isShow: false
					//    },
				],
				list: [],
				times: "",
				time: "3600",
				index: ""
			};
		},

		components: {},
		props: {},
		onShow() {
			this.changeShow(this.index);
		},
		onLoad: function(options) {
			const {
				order
			} = this
			let type = options.type || orderType.ALL;
			this.index = order.findIndex(item => item.type == type)
			this.changeShow(this.index);
		},

		onPullDownRefresh: function() {
			const {
				active,
				order
			} = this
			console.log(this.$refs['order' + order[active].type])
			this.$refs['order' + order[active].type][0].reflesh()
		},

		onReachBottom: function() {
			const {
				active,
				order
			} = this
			console.log(this.$refs['order' + order[active].type])
			this.$refs['order' + order[active].type][0].getOrderListFun()
		},
		methods: {
			changeShow(index) {
				let _this = this
				if (index != -1) {
					this.active = index
					this.order[index].isShow = true
				}
				let ontype = this.order[index].type
				if (ontype == "sub") {
					waitSubmit().then(res => {
						this.list = res.data
						for (var i = 0; i < _this.list.length; i++) {
							let timestamp = new Date().getTime();
							let newtime = timestamp / 1000
							// console.log(newtime)
							// console.log(_this.list[i].end_time)
							let ctime = _this.list[i].end_time - newtime
							let hstime = Math.floor(ctime)
							_this.list[i].time = hstime
							console.log(timeToDate(_this.list[i].end_time))
						}
						for (var i = 0; i < res.data.length; i++) {
							if(res.data[i].is_auto==1){
								res.data[i].img="../../static/images/yun.png"
							}else if(res.data[i].is_auto==0){
								res.data[i].img="../../static/images/icon_collection_s.png"
							}
						}
					}, err => {})
				}
				if (ontype == "examine") {
					auditLists().then(res => {
						console.log(res.data)
						this.list = res.data
						for (var i = 0; i < res.data.length; i++) {
							if(res.data[i].is_auto==1){
								res.data[i].img="../../static/images/yun.png"
							}else if(res.data[i].is_auto==0){
								res.data[i].img="../../static/images/icon_collection_s.png"
							}
						}
					}, err => {})
				}
				if (ontype == "adopt") {
					through().then(res => {
						console.log(res.data)
						this.list = res.data
						for (var i = 0; i < res.data.length; i++) {
							if(res.data[i].is_auto==1){
								res.data[i].img="../../static/images/yun.png"
							}else if(res.data[i].is_auto==0){
								res.data[i].img="../../static/images/icon_collection_s.png"
							}
						}
					}, err => {})
				}
				if (ontype == "Fail") {
					unthrough().then(res => {
						console.log(res.data)
						this.list = res.data
						for (var i = 0; i < res.data.length; i++) {
							if(res.data[i].is_auto==1){
								res.data[i].img="../../static/images/yun.png"
							}else if(res.data[i].is_auto==0){
								res.data[i].img="../../static/images/icon_collection_s.png"
							}
						}
					}, err => {})
				}
			},
			toxq(title, price, order_sn, status, is_auto) {
				if (is_auto == "1") {
					console.log("不能点击")
					return
				} else {
					uni.navigateTo({
						url: "../task-list/taskp-xq?title=" + title + "&price=" + price + "&order_sn=" + order_sn +
							"&status=" + status
					})
				}

			}
		}
	};
</script>
<style lang="less">
	.all {
		padding: 0 40rpx;

		.list {
			margin-top: 50rpx;
			width: 100%;
			height: 250rpx;
			border-radius: 20rpx;
			background-color: #FFFFFF;
			padding: 30rpx 30rpx;

			.list_top {
				display: flex;

				image {
					width: 100rpx;
					height: 100rpx;
				}

				.list_right {
					width: 80%;
					margin-left: 20rpx;

					.ltop {
						display: flex;
						justify-content: space-between;
					}

					.lbot {
						margin-top: 20rpx;
					}
				}
			}
		}
	}
</style>
